<template>
<div>
    <Menu theme="dark" width="auto" @on-select="handleOnSelect">
        <div pdx3>
            <Input v-model=search search placeholder="搜索..." @on-search=handleGotoSearch bd-circle nobd mgx2 />
        </div>
        <MenuItem name="home">
            <Icon type="ios-navigate"></Icon>
            <span>首页</span>
        </MenuItem>
        <MenuItem name="about">
            <Icon type="ios-planet"></Icon>
            <span>关于我们</span>
        </MenuItem>
        <MenuItem name="article-list-1">
            <Icon type="ios-copy"></Icon>
            <span>公司资讯</span>
        </MenuItem>
        <MenuItem name="article-list-2">
            <Icon type="ios-videocam"></Icon>
            <span>微课堂</span>
        </MenuItem>
        <MenuItem name="zw-query">
            <Icon type="md-qr-scanner"></Icon>
            <span>真伪查询</span>
        </MenuItem>
        <MenuItem name="mall">
            <Icon type="ios-cart"></Icon>
            <span>商城</span>
        </MenuItem>
        <MenuItem name="contact-us">
            <Icon type="ios-call"></Icon>
            <span>联系我们</span>
        </MenuItem>
        <MenuItem name="notice">
            <Icon type="md-megaphone"></Icon>
            <span>企业通知</span>
        </MenuItem>
        <MenuItem name="friendly-link">
            <Icon type="ios-link"></Icon>
            <span>友情链接</span>
        </MenuItem>
        <MenuItem v-if="isLogined" name="personal-center">
            <Icon type="md-person"></Icon>
            <span>个人中心</span>
        </MenuItem>
    </Menu>
    <!-- <Input v-model="search" size="large" placeholder="搜索...">
        <Icon type="ios-search" slot="suffix" linkable @click="handleGotoSearch" />
    </Input> -->
</div>
</template>
<script lang="ts">
import { Component, Vue,Inject, Prop,Watch } from 'vue-property-decorator';
import AbpBase from '../../lib/abpbase'

@Component({
    components: {  }
})
export default class IndexMenu extends AbpBase{
	search:string = "";
	handleGoTo(url) {
		window.open(url); 
	}
	handleGotoSearch() {
		this.$router.push({
			name: 'search-result',
			query: {
				search: this.search
			}
		});
	}
	async handleOnSelect(name) {
        switch(name) {
            case 'home':
                this.$router.push({ 
                    name: 'home' 
                }); break;
            case 'about':
                this.$router.push({
                    name:'about', 
                    params:{ 
                        tag: 'companyprofile' 
                    } 
                }); break;
            case 'article-list-1':
                this.$router.push({
                    name:'article-list',
                    params:{
                        systemtype:'1'
                    }
                }); break;
            case 'article-list-2':
                this.$router.push({
                    name: 'article-list',
                    params: { 
                        systemtype: '2'
                    }
                }); break;
            case 'zw-query': 
                this.handleGoTo('https://dd.kq39.cn/zhenwei/index/282'); break;
            case 'mall':
                this.$router.push({
                    name: 'mall',
                }); break;
            case 'contact-us':
                this.$router.push({
                    name: 'contact-us',
                }); break;
            case 'notice':
                this.$router.push({ 
                    name: 'article-list',
                    params: {
                        systemtype: '3'
                    }
                }); break;
            case 'friendly-link':
                this.$router.push({
                    name: 'friendly-link',
                }); break;
            case 'personal-center':
                this.$router.push({
                    name: 'member-index',
                }); break;
        }
	}
}
</script>
